<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>我的收货地址</title>
    <script src="js/jquery-3.3.1.min.js"></script>
    <script src="js/jquery.cookie.js"></script>
    <script src="js/bootstrap.min.js"></script>
    <link rel="stylesheet" type="text/css" href="css/bootstrap.min.css"/>
    <link rel="stylesheet" type="text/css" href="css/myaddress.css"/>
</head>
<body>
    <div class="container" id="returnindex">
        <div class="row">
            <div class="col-xs-9 col-sm-9 col-md-9 col-lg-9"></div>
            <div class="col-xs-1 col-sm-1 col-md-1 col-lg-1" id="goodsmanage"></div>
            <div class="col-xs-1 col-sm-1 col-md-1 col-lg-1" id="ordermanage"></div>
            <div class="col-xs-1 col-sm-1 col-md-1 col-lg-1"><a href="index.html">返回首页</a></div>
        </div>
    </div>
    <div class="container" id="pagetitle">
        <div class="row">
            <div class="col-xs-1 col-sm-1 col-md-1 col-lg-1"></div>
            <div class="col-xs-3 col-sm-3 col-md-3 col-lg-3"><p id="titlep"><span>乐享生活</span>&nbsp;收货地址</p></div>
        </div>
    </div>
    <div class="container" id="bodytitle">
        <div class="row">
            <div class="col-xs-1 col-sm-1 col-md-1 col-lg-1"></div>
            <div class="col-xs-10 col-sm-10 col-md-01 col-lg-10 bodytitle"><p >管理我的收货地址</p></div>
        </div>
    </div>
    <div class="container" id="addresscon">
        <div class="row">
            <div class="col-xs-1 col-sm-1 col-md-1 col-lg-1"></div>
            <div class="col-xs-10 col-sm-10 col-md-10 col-lg-10" id="addressbody"></div>
        </div>
    </div>

    <script type="text/javascript">

        var userId = $.cookie("userId");

        $.get("address/findMyAddress",{userId:userId},function (data1) {
            data1 = JSON.parse(data1);

            var ht = '<div class="row addressrow">\n' +
                '          <div class="col-xs-2 col-sm-2 col-md-2 col-lg-2">收件人</div>\n' +
                '          <div class="col-xs-2 col-sm-2 col-md-2 col-lg-2">电话</div>\n' +
                '          <div class="col-xs-2 col-sm-2 col-md-2 col-lg-2">省</div>\n' +
                '          <div class="col-xs-2 col-sm-2 col-md-2 col-lg-2">市</div>\n' +
                '          <div class="col-xs-2 col-sm-2 col-md-2 col-lg-2">详细地址</div>\n' +
                '          <div class="col-xs-2 col-sm-2 col-md-2 col-lg-2">操作</div>\n' +
                '     </div>';

            for (var i = 0; i < data1.length; i++) {
               ht += '<div class="row myaddress">\n' +
                   '       <input type="text" class="col-xs-2 col-sm-2 col-md-2 col-lg-2" readonly = "readonly" value="'+ data1[i].receiveName +'">\n' +
                   '       <input type="text" class="col-xs-2 col-sm-2 col-md-2 col-lg-2" readonly = "readonly" value="'+ data1[i].telephone +'">\n' +
                   '       <input type="text" class="col-xs-2 col-sm-2 col-md-2 col-lg-2" readonly = "readonly" value="'+ data1[i].province +'">\n' +
                   '       <input type="text" class="col-xs-2 col-sm-2 col-md-2 col-lg-2" readonly = "readonly" value="'+ data1[i].city +'">\n' +
                   '       <input type="text" class="col-xs-2 col-sm-2 col-md-2 col-lg-2" readonly = "readonly" value="'+ data1[i].details +'">\n' +
                   '       <a class="col-xs-2 col-sm-2 col-md-2 col-lg-2" id="del_'+ data1[i].id +'">删除</a>\n' +
                   '  </div>';
            }

            $.get("address/loadAddress",{},function (data) {

                data = JSON.parse(data);

                var op = '<option value="未选中"></option>';

                for (key in data){
                    op += '<option value="'+ key +'">'+ key +'</option>';
                }

                ht += ' <div class="row addaddress">\n' +
                    '       <input type="text" class="col-xs-2 col-sm-2 col-md-2 col-lg-2" id="receive">\n' +
                    '       <input type="text" class="col-xs-2 col-sm-2 col-md-2 col-lg-2" id="telephone">\n' +
                    '       <select id="province" class="col-xs-2 col-sm-2 col-md-2 col-lg-2">'+ op +'</select>\n' +
                    '       <select id="city" class="col-xs-2 col-sm-2 col-md-2 col-lg-2"></select>\n' +
                    '       <input type="text" class="col-xs-2 col-sm-2 col-md-2 col-lg-2" id="details">\n' +
                    '       <a class="col-xs-2 col-sm-2 col-md-2 col-lg-2" id="add">添加</a>\n' +
                    '  </div>';

                $("#addressbody").html(ht);


                $("#province").change(function () {
                    if ($("#province").val() != '未选中'){
                        var citys = data[$("#province").val()];

                        var cityop = '<option value="未选中"></option>';

                        for (var i = 0; i < citys.length; i++) {
                            cityop += '<option value="'+ citys[i] +'">'+ citys[i] +'</option>';
                        }

                        $("#city").html(cityop);

                    }
                });

                for (var i = 0; i < data1.length; i++) {

                    $("#del_" + data1[i].id).click(function () {

                        var id = this.id.split("_")[1];

                        $.get("address/delAddress",{id:id},function (data) {
                            data = JSON.parse(data);

                            if (data.code.toLowerCase() == "success"){
                                location.href = 'myaddress.html';
                            }else {
                                alert("删除收货地址失败");
                            }
                        });

                    });
                }

                $("#add").click(function () {

                   if (isNormalInput($("#receive"))&&isNormalInput($("#telephone"))&&isNormalInput($("#province"))&&isNormalInput($("#city"))&&isNormalInput($("#details")))  {

                       var receive = $("#receive").val();
                       var telephone = $("#telephone").val();
                       var province = $("#province").val();
                       var city = $("#city").val();
                       var details = $("#details").val();

                       $.post("address/addAddress",{receive:receive,telephone:telephone,province:province,city:city,details:details,userId:userId},function (data) {
                           data = JSON.parse(data);
                           if (data.code.toLowerCase() == "success"){
                               location.href = 'myaddress.html';
                           }else {
                               alert("添加收货地址失败");
                           }
                       });


                   }else {
                       alert("您输入的收货地址有误");
                   }
                });
            });


        });


        function isNormalInput(ipt){
            return ipt.val() != null && ipt.val().length != 0 && !ipt.hasClass("error_input") && ipt.val() != '未选中';
        }

    </script>

</body>
</html>